<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>南声-个人中心</title>
		<link rel="stylesheet" type="text/css" href="./css/personal.css" />
		<link rel="stylesheet" type="text/css" href="./layui/css/layui.css" />
		<link rel="stylesheet" type="text/css" href="//at.alicdn.com/t/font_2673097_a1hdv1oo95s.css" />
		<script src="./layui/layui.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<!-- 页面头 -->
		<ul class="layui-nav">
			<li class="layui-nav-item"><a class="headerTitle" href="javascript:;">南声</a></li>
			<li class="layui-nav-item">
				<a href="javascript:;"><span class="userface">黑</span></a>
				<dl class="layui-nav-child layui-nav-child-c layui-anim layui-anim-upbit">
					<dd>写文章</dd>
					<dd>退出登录</dd>
				</dl>
			</li>
		</ul>
		<!-- 个人信息部分 -->
		<div class="persoonlaInfo">
			<div><span class="userface">黑</span></div>
			<div class="infos">
				<span><i class="layui-icon layui-icon-user"> 昵称 : 黑色时刻</i></span>
				<span><i class="layui-icon layui-icon-time"> 加入时间 : 1997-12-30</i></span>
				<span><i class="layui-icon layui-icon-male"> 性别 : 男生</i></span>
				<span><i class="layui-icon layui-icon-location"> 户籍地 : 黑龙江</i></span>
				<span><i class="layui-icon layui-icon-email"> 邮箱 : 123456789@qq.com</i></span>
			</div>
			<div class="layui-text">
				<i class="layui-icon layui-icon-fire"> 座右铭</i> : 活着就意味着必须做点什么，请好好努力！
			</div>
		</div>
		<!-- 文章列表 -->
		<div class="listArticle">
			<div class="layui-card">
				<div class="layui-card-header">您的文章</div>
				<div class="layui-card-body">
					<div class="articleItem">
						<a href="javascript:;">Java从小白到菜鸟教程</a>
						<div>
							<i class="iconfont icon-eye"> 3624</i>
							<i class="iconfont icon-zan"> 999</i>
						</div>
					</div>
					<div class="articleItem">
						<a href="javascript:;">HTML5从小白到菜鸟教程</a>
						<div>
							<i class="iconfont icon-eye"> 3624</i>
							<i class="iconfont icon-zan"> 999</i>
						</div>
					</div>
					<div class="articleItem">
						<a href="javascript:;">CSS3从小白到菜鸟教程</a>
						<div>
							<i class="iconfont icon-eye"> 3624</i>
							<i class="iconfont icon-zan"> 999</i>
						</div>
					</div>
					<div class="articleItem">
						<a href="javascript:;">JavaWeb从小白到菜鸟教程</a>
						<div>
							<i class="iconfont icon-eye"> 3624</i>
							<i class="iconfont icon-zan"> 999</i>
						</div>
					</div>
					<div class="articleItem">
						<a href="javascript:;">jQuery从小白到菜鸟教程</a>
						<div>
							<i class="iconfont icon-eye"> 3624</i>
							<i class="iconfont icon-zan"> 999</i>
						</div>
					</div>
				</div>
				<div style="margin-left: 10px;" id="page"></div>
			</div>
		</div>
		
		<script type="text/javascript">
			layui.use(['laypage'],function(){
				let laypage = layui.laypage;
				laypage.render({
					elem:'page',
					count: 30,
					limit: 5
				})
			})
		</script>
	</body>
</html>
